React = require('react')
Card = require('antd-mobile/lib/card')
# ListView = require('antd-mobile/lib/list-view')
Flex = require('antd-mobile/lib/flex')
Icon = require('antd-mobile/lib/icon')
Toast = require('antd-mobile/lib/toast')
List = require('antd-mobile/lib/list')
InputItem = require('antd-mobile/lib/input-item')
RefreshControl = require('antd-mobile/lib/refresh-control')
{View,Image,TextInput,Text,ScrollView,TouchableHighlight,StyleSheet,Navigator,ListView,TouchableOpacity} = require('react-native')
Dimensions = require('Dimensions')
{ width, height } = Dimensions.get('window')
{View} = require('react-native')
{fetchGetList,fetchRefreshList} = require('../actions/page_ckjl.js')
{connect} = require('react-redux')
_ = require('underscore')

searchIcon = require('../img/search_white.png')

Drawer = require('antd-mobile/lib/drawer')
Button = require('antd-mobile/lib/button')
TopNotice = require('antd-mobile/lib/notice-bar')
DrawerLayout = require('react-native-drawer-layout')
RefreshControl = require('antd-mobile/lib/refresh-control')

backImg = require('../img/back.png')
searchIcon = require('../img/search_white.png')
renderAfterTransfer = require('../highOrderComponent/renderAfterTransfer.js')
basePage = require('../mixins/basePageNew.js')
DescPage = require('./page_ckjl_detail.js')
Page_ckjl = React.createClass
  mixins:[basePage]
  getInitialStat:->
      zwcm:""
      ywcm:""
      hh:""
      imo:""
      mmsi:""
  componentDidMount:->
    @initFetchData()
  rowClick:(model)->
    {navigator} = @props
    setTimeout ->
      navigator.push
        component:DescPage
        name:'inAttempDesc'
        title:'详情'
        params:
          model:model
    ,200
  onDrawerOpenChange:(isOpen)->
    @isOpen = isOpen
    unless isOpen
      @setState
        zwcm:""
        ywcm:""
        imo:""
        mmsi:""
        hh:""
  searchClickHandle:->
    debugger
    # cds =
    #   ZWCM : @refs.inputZwcm._lastNativeText
    #   YWCM : @refs.inputYwcm._lastNativeText
    #   IMO : @refs.inputIMO._lastNativeText
    #   MMSI : @refs.inputMMSI._lastNativeText
    cds =
      ZWCM : @state.zwcm
      YWCM : @state.ywcm
      IMO : @state.imo
      MMSI : @state.mmsi
      HH:@state.hh
    @props.fetchRefresh(cds)
    @drawer.drawer.closeDrawer()

  drawerClickHandle:->
    if @isOpen
      @drawer.drawer.closeDrawer()
    else
      @drawer.drawer.openDrawer()


  renderSlideBar:->
    <View style={{flexDirection:'column',height:height-60,backgroundColor:'#ffffff'}}>
      <List>
        <InputItem labelNumber={5} placeholder="" value={@state.zwcm} onChange={(text)=>@setState zwcm:text}>中文船名</InputItem>
        <InputItem labelNumber={5} placeholder="" value={@state.ywcm} onChange={(text)=>@setState ywcm:text}>英文船名</InputItem>
        <InputItem labelNumber={5} placeholder="" value={@state.hh} onChange={(text)=>@setState hh:text}>呼号</InputItem>
        <InputItem labelNumber={5} placeholder="" value={@state.imo}  onChange={(text)=>@setState imo:text}>IMO</InputItem>
        <InputItem labelNumber={5} placeholder="" value={@state.mmsi} onChange={(text)=>@setState mmsi:text}>MMSI</InputItem>
        <View style={{margin:12}}>
          <Button type="primary" onClick={@searchClickHandle}>查询</Button>
        </View>
      </List>
    </View>
  renderBody:->
    that = @
    <Drawer ref={(drawer)->
      debugger
      that.drawer=drawer} drawerWidth={width * 2 / 3}
      drawerPosition={DrawerLayout.positions.Right}
      sidebar={@renderSlideBar()}
      onOpenChange={@onDrawerOpenChange}>
      {@_renderListView()}
    </Drawer>
  renderRow:(rowData,sectionID,rowID,highlightRow)->
    <TouchableHighlight onPress={@rowClick.bind(@,rowData)} key={rowData.ID}>
      <View style={styles.row}>
        <Text style={[styles.text,{fontWeight:'bold'}]}>
          {"#{rowData.VCVESCNAME}            #{rowData.VCVESENAME}"}
        </Text>
        <View style={{flexDirection:'row'}}>
          <Text style={styles.text}>
            {"船籍:#{rowData.VCNATIONNAME}"}
          </Text>
          <Text style={styles.text}>
            {"呼号:#{rowData.CHCALLNO}"}
          </Text>
        </View>
      </View>
    </TouchableHighlight>
  renderHeader:->
      # <View style={{flexDirection:'row',flex:0,height:60,alignItems:'center', justifyContent:'center',backgroundColor:'#0066FF'}}>
      #   <View style={{flex:1,padding:10}}>
      #     <TouchableOpacity onPress={=>@props.navigator.pop()}>
      #       <Image source={backImg}  style={{height:30,width:30,resizeMode:'contain'}}/>
      #     </TouchableOpacity>
      #   </View>
      #   <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
      #     <Text style={{fontSize:20,color:'#ffffff'}}>船况记录</Text>
      #   </View>
      #   <View style={{flex:1,alignItems:'flex-end',padding:10}}>
      #     <TouchableOpacity onPress={@_showActionSheet}>
      #     </TouchableOpacity>
      #   </View>
      # </View>
      <View style={{flexDirection:'row',flex:0,height:60,alignItems:'center', justifyContent:'center',backgroundColor:'#0066FF'}}>
        <View style={{flex:1,padding:10}}>
          <TouchableOpacity onPress={=>@props.navigator.pop()}>
            <Image source={backImg}  style={{height:30,width:30,resizeMode:'contain'}}/>
          </TouchableOpacity>
        </View>
        <View style={{flex:3,justifyContent:'center',alignItems:'center'}}>
          <Text style={{fontSize:20,color:'#ffffff'}}>船况记录</Text>
        </View>
        <View style={{flex:1,alignItems:'flex-end',padding:10}}>
          <TouchableOpacity onPress={@drawerClickHandle}>
            <Image source={searchIcon}  style={{height:30,width:30,resizeMode:'contain'}}/>
          </TouchableOpacity>
        </View>
      </View>



# <View style={{flexDirection:'column',width:width*2/3,height:height-60}}>
#   <View style={{marginLeft:10,flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
#     <View style={{width:60}}>
#       <Text>中文船名</Text>
#     </View>
#     <View style={{flex:1}}>
#       <TextInput ref="inputZwcm"></TextInput>
#     </View>
#   </View>
#   <View style={{marginLeft:10,flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
#     <View style={{width:60}}>
#       <Text>英文船名</Text>
#     </View>
#     <View style={{flex:1}}>
#       <TextInput ref="inputYwcm"></TextInput>
#     </View>
#   </View>
#     <View style={{marginLeft:10,flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
#       <View style={{width:60}}>
#         <Text>呼号</Text>
#       </View>
#       <View style={{flex:1}}>
#         <TextInput ref="inputHh"></TextInput>
#       </View>
#     </View>
#   <View style={{marginLeft:10,flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
#     <View style={{width:60}}>
#       <Text>IMO</Text>
#     </View>
#     <View style={{flex:1}}>
#       <TextInput ref="inputIMO"></TextInput>
#     </View>
#   </View>
#   <View style={{marginLeft:10,flexDirection:'row',justifyContent:'center',alignItems:'center'}}>
#     <View style={{width:60}}>
#       <Text>MMSI</Text>
#     </View>
#     <View style={{flex:1}}>
#       <TextInput ref="inputMMSI"></TextInput>
#     </View>
#   </View>
#   <View style={{margin:10}}>
#     <Button type="primary" onClick={@searchClickHandle}>查询</Button>
#   </View>
# </View>
styles = StyleSheet.create
  row:
    flexDirection:'column'
    justifyContent:'center'
    padding:10
    backgroundColor:'#F6F6F6'
  text:
    flex:1

mapStateToProps = (state)->
  debugger
  list:state.page_ckjl.list
  pageIndex:state.page_ckjl.pageIndex
  isLoading:state.page_ckjl.isLoading
  completed:state.page_ckjl.completed
  refreshing:state.page_ckjl.refreshing
  connected:state.appState.connected
mapDispatchToProps = (dispatch,wonProps)->
  fetchGet:(pageIndex)->
    dispatch fetchGetList(pageIndex)
  fetchRefresh:->
    dispatch fetchRefreshList()
module.exports = connect(mapStateToProps,mapDispatchToProps)(Page_ckjl)
